import React from 'react';
import { Link, browserHistory } from 'react-router';
import Logo from './Logo.jsx';
import Menus from './Menus.jsx';
import Modules from './modules/index.jsx';
import UserInfo from './UserInfo.jsx';
import ModulesSelect from './modules/ModulesSelect.jsx';

const history = browserHistory;


class Navbar extends React.Component{
  static Prototypes: {
    options: PropTypes.array.isRequired
  }
  constructor(props) {
    super(props);
    this.state = {
      modulesVisible: false,
      menus: []
    }
  }
  setModulesVisible() {
    this.setState({
      modulesVisible: !this.state.modulesVisible
    });
  }
  hideModules() {
    this.setState({
      modulesVisible: false
    });
  }
  /**
   * 切换页面时，默认跳转到第一个模块
   */
  setMenus(menus) {
    this.setState({
      menus: menus
    });
    history.push(menus[0].to);
  }
  render() {
    return (
      <div className="navbar">
        <Logo />
        <Menus menus={this.state.menus} />
        <Modules setVisible={this.setModulesVisible.bind(this)} />
        <UserInfo />        
        <ModulesSelect 
          visible={this.state.modulesVisible} 
          options={this.props.options} 
          setMenus={this.setMenus.bind(this)} 
          hide={this.hideModules.bind(this)}
        />
      </div>
    );
  }
};

export default Navbar;





